import React from 'react';
import ReactDOM from 'react-dom';

class ModalAlertTimeout extends React.Component {

	render(){
		return (
		<div className="modal fade" ref="timeoutModal">
			<div className="modal-dialog">
				<div className="modal-content">
					<div className="modal-header">
						<button type="button" className="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 className="modal-title">Timeout</h4>
					</div>
					<div className="modal-body">
						<p>The cart has time-out.Please try again.</p>
						
					</div>
					<div className="modal-footer">
						<button type="button" className="btn btn-default" data-dismiss="modal">Close</button>
						<button type="button" className="btn btn-primary">Save changes</button>
					</div>
				</div>
			</div>
		</div>)
	}
	 
	componentDidMount(){
		setTimeout(()=>{
			let timeoutModal = this.refs.timeoutModal;
			console.log(timeoutModal);
			$(timeoutModal).modal('show');
			$(timeoutModal).on('hidden.bs.modal',function(e){
				console.log(e);

				ReactDOM.unmountComponentAtNode(e.target.parentNode);
			})

		},100)
	}
}

export default ModalAlertTimeout 